button{
    line-height: 66rpx;
    border: none;
    background: none;
    border:none;
    
}
.iconfont {
    font-size:60rpx;
}
.list-header {
    width: 100%;
    height: 70rpx;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    box-sizing: border-box;
}

.list-header-img {
    height: 70rpx;
    width: 104rpx;
    margin: 0 0 0 20rpx;
}

.list-header-img image {
    width: 104rpx;
    height: 70rpx;
}

.list-header-sort {
    height: 70rpx;
    color: #3b4f82;
    font-size: 28rpx;
    line-height: 40rpx;
    text-align: right;
    margin: 30rpx 20rpx 0 0;
}

.list-header-sort span {
    padding: 0 8rpx;
}

.list-header-sort span.line {
    font-size: 22rpx;
    color: #3b4f82;
}

.list-header-sort span.check {
    color: #fff;
}

.list-header-sort span.red-dot {
    background: #f00;
    padding: 0;
    display: inline-block;
    width: 12rpx;
    height: 12rpx;
    border: 0;
    border-radius: 100%;
    margin: 0 0 16rpx 0;
}

.main-list-item,
.rank-list-item {
    width: 100%;
    border-radius: 6rpx;
    box-shadow: 0 2rpx 30rpx rgba(0, 0, 0, 0.05);
    margin: 0 0 30rpx 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    background-color: #fff;
}

.main-item-article-hover {
    background: none;
    border: none;
}

.main-item-article {
    width: 100%;
    padding: 0 25rpx;
    box-sizing: border-box;
    display: flex;
}

.article-title {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    margin: 46rpx 0 15rpx 0;
    font-size: 40rpx;
    line-height: 56rpx;
    font-weight: bold;
}

.article-title-left,
.article-title-right {
    width: 20rpx;
    height: 20rpx;
    margin: -30rpx 16rpx 0;
}

.article-title-bg {
    width: 70rpx;
    height: 8rpx;
    border-radius: 4rpx;
    background: #f8e71c;
}

.article-text {
    font-size: 38rpx;
    line-height: 56rpx;
    font-weight: bold;
    margin: 27rpx 0 0 0;
    color: #000;
    text-align: left;
}

.main-item-sidebar {
    width: calc(100% - 80rpx);
    height: 80rpx;
    line-height: 80rpx;
    margin: 40rpx 0 0 0;
    padding-top:16rpx;
    box-sizing: border-box;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    border-top: 1rpx solid #ececec;
}

.main-item-sidebar view {
    position: relative;

}

.main-item-sidebar .like-num-area {
    position: absolute;
    top: -20rpx;
    right: -20rpx;
    font-size: 24rpx;
}
.share-container{
    width:100%;
    height:100%;
    top:0;
    left:0;
    position: fixed;
    background: rgba(0,0,0,0.8);
    z-index: 1001;
}
.share-info{
    width:560rpx;
    height:80%;
    padding:4%;
    position: absolute;
    top:5%;
    right:0;
    left:0;
    margin:0 auto;
    background: #FFF;
    border-radius:10rpx;
}
.share-poster{overflow: hidden;}
.share-poster image{
    max-width: 100%;
    max-height: 100%;
    margin:0 auto;
}
.share-tool{
    width:100%;
    display: flex;
    line-height: 120rpx;
    position: absolute;
    bottom:0;
    left:0;
    height:120rpx;
    border-top: 2rpx solid #ccc;
    background: #FFF;
}
.share-tool .iconfont {
    font-size:40rpx;
    font-weight: 600;
}
.share-tool>view{position: relative;width: 50%;text-align: center;}
.share-friend::before{
    content: " ";
    width:1px;
    height:40%;
    position: absolute;
    right:0;
    top:30%;
    z-index:1;
    background-image:linear-gradient(to top,#dbd9d0,#000,#dbd9d0);
}
.share-friend button{
    width:100%;
    height:100%;
    line-height: 114rpx;
    display: block;
    border:none;
    background: transparent;
    font-size:30rpx;
}
.share-close{
    width:40rpx;
    height:40rpx;
    line-height: 40rpx;
    padding:10rpx;
    position: absolute;
    top:-20rpx;
    right:-20rpx;
    border-radius: 50%;
    background: rgba(251,208,51,1);
    color:#000;
    text-align: center;
    overflow: hidden;
}
.share-close .iconfont{font-size:30rpx;font-weight: 600;}